<template>
  <view>
    <image src="/static/icon_bj.png" class="w100 absolute" mode="widthFix"></image>
    <view class="title-warp">
      <view class="title">综合素质实践管理平台-学生端</view>
      <!-- <image src="/static/icon_iu.png"></image> -->
    </view>
    <view class="w100 relative pl-24 pr-24">
      <view class="w100 bgff br-20 rows rowsm rowsw mb-20  mt-20 pt-30">
        <!-- @click="$tools.goNext(item.path)" -->
        <view class="rowscl rowsm ml-15 mr-15 w-144 pb-30" v-for="(item, index) in tabList" :key="index"
          @click="goSubmit(item)">
          <uni-badge v-if="item.type != 100000" style="text-align: center" class="uni-badge-left-margin"
            :text="item.number" absolute="rightTop" :offset="item.type > 2 ? [10, 0] : [0, 0]" size="small">
            <image :src="item.img" class="w-96 h-92 mb-10" mode=""></image>
            <view class="fs-28 fw-500 col333">{{ item.name }}</view>
          </uni-badge>
          <view style="text-align: center" class="uni-badge-left-margin" v-else>
            <image :src="item.img" class="w-96 h-92 mb-10" mode=""></image>
            <view class="fs-28 fw-500 col333">{{ item.name }}</view>
          </view>
        </view>
      </view>


      <view class="w100 rowsb rowsm mb-20" v-if="list1.length > 0">
        <view class="fs-30 col333 fw-b">通知公告</view>
        <view class="fs-24" style="color: #707070;" @click="$tools.goNext(`/pages/index/newsList?title=通知公告`)">更多>></view>
      </view>
      <view class="w100 p-all-24 bgff br-20 mb-20" v-for="(item, index) in list1" :key="item.name"
        @click="$tools.goNext('/pages/index/newsDetail?title=通知公告&id=' + item.id)">
        <view class="fs-28 col666 mb-30">{{ item.name }}</view>
        <view class="w100 rows rowsm" style="flex-direction: row-reverse;">
          <view class="fs-24 col888">{{ item.createTime }}</view>
        </view>
      </view>

      <view class="w100 rowsb rowsm mb-20" v-if="list2.length > 0">
        <view class="fs-30 col333 fw-b">政策资讯</view>
        <view class="fs-24" style="color: #707070;" @click="$tools.goNext(`/pages/index/newsList?title=政策咨询`)">更多>></view>
      </view>
      <view class="w100 p-all-24 bgff br-20 mb-20" v-for="(item, index) in list2" :key="index"
        @click="$tools.goNext('/pages/index/newsDetail?title=政策咨询&id=' + item.id)">
        <view class="fs-28 col666 mb-10">{{ item.title }}</view>
        <view class="w100 rows rowsm" style="flex-direction: row-reverse;">
          <view class="fs-24 col888">{{ item.createTime }}</view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      tabList: [
        // {
        //   name: '劳动教育',
        //   img: '/static/laodong.png',
        //   // path:'/pagesCopy/submitWork/weekWork'
        //   path: '/pagesCopy/practiceTask/practice',
        //   type: 1,
        //   number: 0
        // },
        // {
        //   name: '职业素养',
        //   img: '/static/suzhi.png',
        //   path: '/pagesCopy/practiceTask/practice',
        //   type: 2,
        //   number: 0
        // },
        // {
        //   name: '应急安全',
        //   img: '/static/yingji.png',
        //   path: '/pagesCopy/practiceTask/practice',
        //   type: 3,
        //   number: 0
        // },
        // {
        //   name: '思政实践',
        //   img: '/static/sizheng.png',
        //   path: '/pagesCopy/practiceTask/practice',
        //   type: 4,
        //   number: 0
        // },
        // {
        //   name: '创新创业',
        //   img: '/static/chuangxin.png',
        //   path: '/pagesCopy/practiceTask/practice',
        //   type: 5,
        //   number: 0
        // },
        // {
        //   name: '我的报告',
        //   img: '/static/icon_ld.png',
        //   path: '/pagesCopy/practiceTask/report',
        //   type: 99998,
        //   number: 0
        // },
        // {
        //   name: '知识问答',
        //   img: '/static/zhishi.png',
        //   path: '/pagesCopy/trivia/index',
        //   type: 99999,
        //   number: 0
        // },
        // {
        //   name: '排行榜单',
        //   img: '/static/icon_ph.png',
        //   path: '/pages/index/rank',
        //   type: 100000,
        //   number: 0
        // }
      ],
      list1: [],
      list2: [],
      info: '',
    }
  },
  onShow() { },
  mounted() {
    uni.$on('studentUnreportEmit', (student) => {
      student.forEach(item => {
        this.tabList.forEach((it, y) => {
          if (item.practice_type == it.type) {
            this.tabList[y].number = item.number;
          }
        })
      })
    });
  },
  created() {
    this.getTypeCongfigList();
    this.getList();
  },
  methods: {
    getTypeCongfigList() {
      this.$tools.axiosFromToken('GET', 'project/practice/type/config/listAll', {}, '加载中').then(res => {
        if (res.code != 200) return this.$tools.showtt(res.msg)
        res.rows.forEach(item => {
          this.tabList.push(
            {
              name: item.name,
              type: item.id,
              number: 0,
              path: '/pagesCopy/practiceTask/practice',
              img: item.imageUrl == 'laodong' ? '/static/laodong.png' : item.imageUrl == 'suzhi' ? '/static/suzhi.png' : item.imageUrl == 'yingji' ? '/static/yingji.png' : item.imageUrl == 'sizheng' ? '/static/sizheng.png' : item.imageUrl == 'chuangxin' ? '/static/chuangxin.png' : this.$tools.avatarUrl + item.imageUrl,
            }
          );
        });
        this.tabList = this.tabList.concat([
          {
            name: '我的报告',
            img: '/static/icon_ld.png',
            path: '/pagesCopy/practiceTask/report',
            type: 99998,
            number: 0
          },
          {
            name: '知识问答',
            img: '/static/zhishi.png',
            path: '/pagesCopy/trivia/index',
            type: 99999,
            number: 0
          },
          {
            name: '排行榜单',
            img: '/static/icon_ph.png',
            path: '/pages/index/rank',
            type: 100000,
            number: 0
          }]);
      })
    },
    goSubmit(item) {
      if (item.type == 99998 || item.type == 99999 || item.type == 100000) {
        this.$tools.goNext(`${item.path}`)
      } else {
        this.$tools.goNext(`${item.path}?type=${item.type}&current=0`)
      }
      // #ifdef MP-WEIXIN
      // this.$tools.goNext(`/pagesCopy/submitWork/weekWork?type=${i}&title=${title}`)
      // this.$tools.goNext(`${item.path}?type=''&title=${item.name}`)
      // #endif
    },
    getList() {
      this.$tools.axiosFromToken('POST', 'pronotice/list', {}, '加载中').then(res => {
        if (res.code != 200) return this.$tools.showtt(res.msg)
        this.list1 = res.rows.length > 2 ? res.rows.slice(0, 2) : res.rows;
      })
      this.$tools.axiosFromToken('POST', `prozczx/list`, {}, '加载中').then(res => {
        if (res.code != 200) return this.$tools.showtt(res.msg)
        this.list2 = res.rows.length > 2 ? res.rows.slice(0, 2) : res.rows;
      })
    }
  },
}
</script>

<style lang="scss">
page {
  background: #f7f6fa;
}

//  .uni-nav-bar-text{
//   display: inline-block;
//   font-size: 18px !important;
//   margin-top: 24px !important;

//  }

//  .relative{
//   top: 20px;
//  }
.title-warp {
  width: 100%;
  position: relative;
  height: 80px;

  .title {
    font-size: 18px;
    display: block;
    line-height: 100px;
    text-align: center;
  }

  image {
    width: 40rpx;
    height: 40rpx;
    position: absolute;
    top: 77px;
    left: 15px;
  }
}
</style>
